<template>
    <div class="buttonGroup">
        <div style="float: right;display: flex;">
            <el-form-item label="文件名">
                <el-input v-model="fileName"></el-input>
            </el-form-item>
            <el-button style="margin-left: 10px;" @click="save" type="primary" plain>提 交</el-button>
        </div>
    </div>

    <tsCodeEditor  v-model="text" height="700" mode="markdown"></tsCodeEditor>
</template>
<script setup>
import { ref, onMounted } from 'vue'
import tsCodeEditor from '@/components/scCodeEditor/index.vue'
import API from '@/api/model/meta'
import { useRoute, useRouter } from 'vue-router'
import useTabs from '@/utils/useTabs'
const route = useRoute()
const router = useRouter()
const fileName = ref()
const text = ref()
onMounted(()=>{
    if(route.query.fileName){
        fileName.value = route.query.fileName
        getInit()
    }
})
const getInit = async () =>{
    let res = await API.pageTemplate.readFileContent.post({moduleId:route.query.id,fileName:route.query.fileName})
    console.log(res)
    if(res.code == 200){
        text.value = res.data
    }
}
const save = async () => {
    let res = await API.pageTemplate.saveOrupdateFile.post({ moduleId: route.query.moduleId, fileContent: text.value, fileName: fileName.value })
    if (res.code == 200) {
        useTabs.close()
        router.back()
    }
}
</script>
<style scoped>
.buttonGroup {
    align-items: center;
    box-sizing: border-box;
    /* display: flex; */
    height: 48px;
    /* justify-content: flex-end; */
    margin-bottom: 12px;
    padding: 10px 16px;
    font-size: 12px;
    list-style-type: none;
    /* text-align: left; */
    background-color: #FFFFFF;
}
</style>